#diagram {width: 100%; height: auto;}
svg {width: 100%; height: 100%;}
svg .room{
    stroke-width: 0.75;
    //stroke: #fff;
    //stroke: silver;
    stroke: black;
    -webkit-transition: stroke 0.5s, stroke-width 0.5s;
    -o-transition: stroke 0.5s, stroke-width 0.5s;
    transition: stroke 0.5s, stroke-width 0.5s;
}

/** svg .room:hover , .room.active {
    cursor: pointer;
    stroke-width: 4;
    stroke: #000;
} **/

.regionlist {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
.regionlist > div {
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid grey;
}

.regionlist > div.active {
    font-weight: bold;
    background-color: lightblue;
}

.regionlist > div > div {
    display: inline-block;
    width: 100%;
}

.scale {
    position: relative;
}
.scale div {
    width: 9.07%;
    display: inline-block;
    text-align: center;
    color: silver;
    font-weight: bold;
    padding: 5px 0;
}


#chat {
    margin-left:  35%;
    margin-top: 20px;
}

.btn-green {color: green;}
.btn-yellow {color: yellow;}
.btn-red {color: red;}

#green_span { background-color: #55dd55;
              padding-top: 5px;
              padding-bottom: 5px;
              padding-left: 15px;
              padding-right: 15px;
}

#yellow_span { background-color: yellow;
               padding-top: 5px;
               padding-bottom: 5px;
               padding-left: 15px;
               padding-right: 15px;
}
#red_span { background-color: red;
            color: white;
            padding-top: 5px;
            padding-bottom: 5px;
            padding-left: 15px;
            padding-right: 15px;
}

#blue_span { background-color: lightblue;
              padding-top: 5px;
              padding-bottom: 5px;
              padding-left: 15px;
              padding-right: 15px;
}

.btn-green {color: green;}
.btn-yellow {color: yellow;}
.btn-red {color: red;}


.pointer { cursor: pointer;}
.pointer:hover { font-weight: bold;}
a {vertical-align: bottom;}
a:visited { color: white;}
a:link { color: white;}
a:hover { color: greenyellow;}

li > a:visited { color: black;}
li > a:link { color: black;}
li > a:hover { color: blue;}

.infotext-section {margin-left: 25px;}


.admin_status_NoDanger {background-color: #55dd55; color: white; content: "No Danger"}
.admin_status_Caution {background-color: yellow; content: "Caution"}
.admin_status_MajorEmergency {background-color: red; color: black; content: "Major Emergency"}
.admin_status_CautionAlert {background-color: yellow; color: black; content: "Caution Alert"}
.admin_status_MedicalAlert {background-color: lightblue; color: black; content: "Medical Alert"}
.admin_status_EmergencyAlert {background-color: red; color: black; content: "Emergency Alert"}
.admin_status_-{background-color: magenta; color: magenta;}
.admin_status_-:after {background-color: magenta; color: black; content: "Suspected Duress";}


.status_NoDanger {background-color: #55dd55; color: white; content: "No Danger"}
.status_Caution {background-color: yellow; content: "Caution"}
.status_MajorEmergency {background-color: red; color: black; content: "Major Emergency"}
.status_CautionAlert {background-color: yellow; color: black; content: "Caution Alert"}
.status_MedicalAlert {background-color: lightblue; color: black; content: "Medical Alert"}
.status_EmergencyAlert {background-color: red; color: black; content: "Emergency Alert"}
.status_-{background-color: #55dd55; color: #55dd55;}
.status_-:after {background-color: #55dd55; color: white; content: "No Danger";}

.center {
    margin: auto;
    width: 60%;
    text-align: center;
}

.vertical-center {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

#today { font-size: 10px;}

@media screen and (max-width: 600px) {
  #today {
    visibility: hidden;
    display: none;
  }

   .no-mobile {
       display: none;
       visibility: hidden;
   }
}

.ui-header {padding-bottom: 0px;}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    border: 1px solid #aaa;
    padding: 20px;
    font: 12px/12px Arial;
    height: 57px;
}

option {
    -webkit-appearance: none;
    -moz-appearance: none;
    color: black;
}


/** Fix for iPhone phone number formatting **/

a[href^=tel] {
    color: inherit;
    text-decoration: none;
}

a.ui-link{
    font-family: Helvetica;
    font-color: black;
    font-weight: normal;
    text-shadow: none;
}